import { Module } from 'vuex';
import { appState } from './types';
import { RootState } from '../../type';
import storage from '@/utils/helper/storage';
const state: appState = {
    collapsed: false,
    theme: storage.get('theme') || 'light',
    deviceType: 'desktop',
    globalLoading: false
};

type StateType = typeof state

const app: Module<StateType, RootState> = {
    namespaced: true,
    state,
    mutations: {
        SET_COLLAPSED: (state, payload) => {
            state.collapsed = payload;
        },
        SET_THEME: (state, payload) => {
            state.theme = payload ? 'dark' : 'light';
            storage.set('theme', state.theme);
        },
        SET_DEVICETYPE: (state, payload) => {
            state.deviceType = payload;
        },
        SET_GLOBALLOADING: (state, payload) => {
            state.globalLoading = payload;
        }
    }
};

export default app;
